<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <title>购物车</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link href="/public/static/homes/css/iconfont/iconfont.css" rel="stylesheet"/>
    <link href="/public/static/homes/css/common.css" rel="stylesheet"/>
    <link href="/public/static/homes/css/cart.css" rel="stylesheet"/>
    <style>
        .gray{
            background-color:gray;
            border: 1px solid gray;
        }
        .red{
            background-color:red;
            border: 1px solid red;
        }
        .btn{
            line-height: 30px;
            background-color: #e5e5e5;
            border: none;
            height: 30px;
        }
        .blue{
           background: #4d90fe;
        }
        .green{
           background-color: #35aa47;
        }
    </style>
</head>
<body class="graybg-theme">
    <!--头部-->
{:widget("Cate/header")}
        <div class="cart-header wrapper">
            <div class="logo">
                <a href="index.html"><img src="/public/static/homes/img/logo.png" alt="logo" /></a>
            </div>
            <div class="step-box">
                <div class="row">
                    <div class="step first active col-3">
                        <span class="num">1</span><span class="line"></span><span class="label">我的购物车</span>
                    </div>
                    <div class="step col-3">
                        <span class="num">2</span><span class="line"></span><span class="label">确认订单信息</span>
                    </div>
                    <div class="step col-3">
                        <span class="num">3</span><span class="line"></span><span class="label">选择支付方式</span>
                    </div>
                    <div class="step last col-3">
                        <span class="num">4</span><span class="line"></span><span class="label">完成付款</span>
                    </div>
                </div>
            </div>
        </div>

    <!--头部-->
    {if condition="!empty($carts)"}
    <div class="wrapper">
        <table class="cart-table">
          
                <tr class="hd">
                    <th width="30px" class="first">&nbsp;</th>
                    <th width="430px">商品名称</th>
                    <th width="180px">单价</th>
                    <th width="190px">数量</th>
                    <th width="180px">小计</th>
                    <th width="190px">操作</th>
                </tr>
          
            {foreach name="carts" item="row"}
        
                <tr class="goods">
                    <td class="first"><div class="check"><input type="checkbox" name="id" value="{$row.id}" checked /></div></td>
                    <td>
                        <div class="info-box">
                            <img src="{$row['pic']}" alt="">
                            <div class="info">
                                <div class="name">{$row['name']}</div>
                            </div>
                        </div>
                    </td>
                    <td>￥<span class="unitprice">{$row['price']}</span></td>
                    <td>
                        <div class="mod-numbox cart-numbox" data-max="30">
                            <span class="count-minus" name="{$row['id']}"></span>
                            <input class="count-input" value="{$row['num']}" id="numx"  type="text" name="num" />
                            <span class="count-plus" name="{$row['id']}"></span>
                        </div>
                    </td>
                    <td class="txt-error">￥<span class="price">{$row['price']*$row['num']}</span></td>
                    <td><a class="delete iconfont icon-shanchu"  name="{$row['id']}"></a></td>
                </tr> 
           
            {/foreach}
            
        </table>
        <div class="cart-total-box">
            <div class="cart-total">
                <div class="fl">
                    <div style="float:left;padding-right:20px;">
                       <button class="btn blue allchoose">全选</button> 
                       <button class="btn nochoose">全不选</button> 
                       <button class="btn blue fchoose">反选</button> 
                       <button class="btn del">删除</button> 
                    </div>
                    <div class="go-account ui-btn-theme">
                    <a style="color:white" href="/homeindex/index">继续购物</a>
                    </div>
                    <div class="count">共 <span class="cartnum" id="totalNum">{$sum}</span> 件商品
                    </div>
                </div>
                <div class="fr">
                    <div class="price">
                        合计（不含运费）：<span id="totalMoney">{$total}</span>元
                    </div>
                    <a class="go-account ui-btn-theme" href="/account/Account/total/{$total}">去结算</a>
                </div>
            </div>
        </div>
    </div>
    {else/}
   <div class="wrapper">
            <div class="ui-page-notice cartempty">
                <div class="section">
                    <i class="ico iconfont icon-cartempty"></i>
                    <div class="cont">
                        <div class="tit">购物车空空的哦~，去看看心仪的商品吧~</div>
                        <div>
                            <a href="/homeindex/index" class="ui-btn-theme">去逛逛</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    {/if}
{:widget("Cate/footer")}
</body>
<link rel="stylesheet" href="/public/static/homes/js/slick/slick.css"/>
<script src="/public/static/bs/js/jquery-1.8.3.min.js"></script>
<script>
  // // alert($);
    //减
    $(".count-minus").click(function(){
        o=$(this);
        id = $(this).attr("name");
        $.get("/cart/subtract",{id:id},function(data){
        //我的购物车(全部页面)全部商品数量
        o.parents('body').find('#cart_num').html(data.sum); 
        //全部商品数量
        o.parents('body').find('#totalNum').html(data.sum);
        //全部总价
        o.parents('body').find('#totalMoney').html(data.total);
        //数量
        o.next("input").val(data.num);
        //小计赋值
        o.parents('tr').find('td:eq(5)').find('span').html(data.tot);
    },'json');
  })
  // //加 
  $(".count-plus").click(function(){
       o=$(this);
       id=$(this).attr("name");
    //Ajax
    $.get("/cart/plus",{id:id},function(data){
      // alert(data);
        //我的购物车(全部页面)全部商品数量
        o.parents('body').find('#cart_num').html(data.sum); 
        //全部商品数量
        o.parents('body').find('#totalNum').html(data.sum);
        //全部总价
        o.parents('body').find('#totalMoney').html(data.total);
      //数量
      o.prev("input").val(data.num);
      //总计赋值
      o.parents('tr').find('td:eq(4)').find('span').html(data.tot);
    },'json');
  })
//单条删除
  $(".delete").click(function(){
    d = $(this);
    id = $(this).attr("name");
    $.get("/cart/delete",{id:id},function(data){
        // alert(data);
        if (data.del == 1) {
            //删除所在数据的tr
            alert("删除成功");
            //我的购物车(全部页面)全部商品数量
            d.parents('body').find('#cart_num').html(data.sum); 
            //全部商品数量
            d.parents('body').find('#totalNum').html(data.sum);
            //全部总价
            d.parents('body').find('#totalMoney').html(data.total);
            //多少款商品
            d.parents("tr").remove();
        };
    },'json');
  })
  //全选
  $(".allchoose").click(function(){
    $(".goods").find("td").each(function(){
      //把所有的复选框选中
      // alert('111');
      $(this).find(":checkbox").attr("checked",true);
    })
 })
  //全不选
    $(".nochoose").click(function(){
      $(".goods").find("td").each(function(){
        //把所有的复选框取消
        $(this).find(":checkbox").attr("checked",false);
      })
    })

    //反选
    $(".fchoose").click(function(){
      $(".goods").find("td").each(function(){
        if($(this).find(":checked").attr("checked")){
          $(this).find(":checkbox").attr("checked",false);
        }else{
          $(this).find(":checkbox").attr("checked",true);
        }
      })
    })

    //删除
    $(".del").click(function(){
      da = $(this);
      arr=[];
      //获取选中数据id
      $(":checkbox").each(function(){
        if($(this).attr("checked")){
          id=$(this).val();
          // alert(id);
          arr.push(id);
        }
      })
      // alert(arr);
      $.get("/cart/del",{arr:arr},function(data){
        // alert(data);
        if(data.del_all==1){
          alert("删除成功");
          //我的购物车(全部页面)全部商品数量
            da.parents('body').find('#cart_num').html(data.sum); 
            //全部商品数量
            da.parents('body').find('#totalNum').html(data.sum);
            //全部总价
            da.parents('body').find('#totalMoney').html(data.total);
            // alert(data.total);
          //删除数据所在的tr
          for(var i=0;i<arr.length;i++){
            $("input[value="+arr[i]+"]").parents("tr").remove();
          }

        }else{
          alert(data);
        }
      },'json');
    })
</script>
</html>